<template>
	<view class="content">
		<!-- 登录前的登录框 -->
		<view v-if="!login" class="login-box">
			<h4>登录</h4>
			<u-field v-model="account" type="text" label="账号" placeholder="请填写账号">
			</u-field>
			<u-field v-model="pwd" type="password" label="密码" placeholder="请填写密码">
			</u-field>
			<u-button type="primary" size="mini" @click="handleLogin">登录</u-button>
		</view>
		<!-- 登录后的界面 -->
		<view v-else class="login-success">
			<view class="login-success-header">
				<view class="user-name-cirle">
					<u-avatar bg-color="#F5CB5A" mode="circle" :text="userName"></u-avatar>
				</view>
				<view class="user-name-account">
					<view>{{userName}}</view>
					<view>{{userAccount}}</view>
				</view>
			</view>
			<u-gap height="20" bg-color="#eee"></u-gap>
			<view class="all-funcs">
				<view class="every-funcs" v-if="myRole == 'hsjcdManager'" @click="handleGo('hsjc')">
					<text class="iconfont icon-qrcode" style="color: #0982D9;">我负责的核酸检测点</text>
					<u-icon name="arrow-right-double"></u-icon>
				</view>
				<view class="every-funcs" v-else-if="myRole == 'ymzsdManager'" @click="handleGo('ymjz')">
					<text class="iconfont icon-hesuanjiance" style="color: #0982D9;">我负责的疫苗接种点</text>
					<u-icon name="arrow-right-double"></u-icon>
				</view>
				<view class="every-funcs" @click="handleLogout">
					<text class="iconfont icon-tuichu" style="color: #0982D9;">退出登录</text>
					<u-icon name="arrow-right-double"></u-icon>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	let me;
	import funcs from "@/static/js/func.js";
	export default {
		data() {
			return {
				login: !!uni.getStorageSync("token"),
				// 未登录
				account: "",
				pwd: "",
				// 已登录
				userName: uni.getStorageSync("userName") || "",
				userAccount: uni.getStorageSync("userAccount") || "",
				myRole: uni.getStorageSync("myRole") || "",
			};
		},
		onLoad() {
			me = this;
			if (uni.getStorageSync("token")) {
			me.judgeTokenIsValid();
			}
		},
		methods: {
			/**
			 * 判断当前token是否在有效期
			 */
			judgeTokenIsValid() {
				uni.showLoading({
					title: "加载中"
				})
				me.$api.requestTask("/judgeTokenIsValid", {
					token: uni.getStorageSync("token")
				}, res => {
					uni.hideLoading()
					if (res.code == "200") {
					} else if (res.msg == "登录已过期" || res.msg == "token无效") {
						me.login = false;
						me.userName = "";
						me.userAccount = "";
						me.myRole = "";
						uni.clearStorageSync();
					} else {
						funcs.showModalTips(res.msg || "登录失败，请重试");
					}
				}, err => {
					uni.hideLoading()
					funcs.showModalTips("对不起，系统错误，请稍后再试");
				})
			},
			/**
			 * 登录
			 */
			handleLogin() {
				if (!me.account) {
					funcs.showModalTips("请填写账号");
					return;
				} else if (!me.pwd) {
					funcs.showModalTips("请填写密码");
					return;
				}
				let param = {
					account: me.account,
					password: me.pwd
				}
				uni.showLoading({
					title: "加载中"
				})
				me.$api.requestTask("/login", param, res => {
					uni.hideLoading()
					if (res.code == "200") {
						me.login = true;
						me.userName = res.data.name;
						me.userAccount = me.account;
						me.myRole = res.data.role_code;
						uni.setStorageSync("userName", res.data.name);
						uni.setStorageSync("userAccount", me.account);
						uni.setStorageSync("myRole", res.data.role_code);
						uni.setStorageSync("token", res.data.token);
					} else {
						funcs.showModalTips(res.msg || "登录失败，请重试");
					}
				}, err => {
					uni.hideLoading()
					funcs.showModalTips("对不起，系统错误，请稍后再试");
				})
			},
			// 去详情页
			handleGo(flag) {
				let url = flag == "hsjc" ? "/pages/mine/hsjcdManage" : flag == "ymjz" ? "/pages/mine/ymjzdManage" : "";
				if (!!url) {
					uni.navigateTo({
						url: url
					})
				}
			},
			// 退出登录
			handleLogout() {
				uni.showLoading({
					title: "加载中"
				})
				me.$api.requestTask("/logout", {
					account: me.userAccount
				}, res => {
					uni.hideLoading()
					console.log(11, res);
					if (res.code == "200") {
						me.login = false;
						me.userName = "";
						me.userAccount = "";
						me.myRole = "";
						uni.clearStorageSync();
					} else {
						funcs.showModalTips(res.msg || "退出登录失败，请重试");
					}
				}, err => {
					uni.hideLoading()
					console.log(22, err);
					funcs.showModalTips("对不起，系统错误，请稍后再试");
				})
			}
		}
	};
</script>

<style lang="scss" scoped>
	.content {
		.login-box {
			position: fixed;
			width: 70vw;
			left: 15vw;
			top: 30vw;
			text-align: center;
			border: 1px solid #ccc;
			padding: 16rpx 0;
			border-radius: 16rpx;
		}

		.login-success {
			.login-success-header {
				padding: 16rpx;
				display: flex;

				.user-name-cirle {}

				.user-name-account {
					padding-left: 24rpx;
					line-height: 1.4em;
				}
			}

			.all-funcs {
				.every-funcs {
					display: flex;
					justify-content: space-between;
					padding: 0 24rpx;
					height: 3em;
					line-height: 3em;
					border-bottom: 1px solid #ccc;

					/deep/.iconfont {
						span {
							padding-left: 12rpx;
							color: #000;
						}
					}
				}
			}
		}
	}
</style>
